﻿<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <!-- 包含公共的JSP代码片段 -->
    <title>餐馆王平台</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script type="text/javascript" src="${detailUrl}/style/js/jquery.js"></script>
    <script type="text/javascript" src="${detailUrl}/style/js/page_common.js"></script>
    <link href="${detailUrl}/style/css/common_style_blue.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" type="text/css" href="${detailUrl}/style/css/index_1.css"/>
</head>
<body>

<!-- 页面标题 -->
<div id="TitleArea">
    <div id="TitleArea_Head"></div>
    <div id="TitleArea_Title">
        <div id="TitleArea_Title_Content">
            


            <img border="0" width="13" height="13" src="${detailUrl}/style/images/title_arrow.gif"/> 更新新菜品


        </div>
    </div>
    <div id="TitleArea_End"></div>
</div>

<!-- 主内容区域（数据列表或表单显示） -->
<div id="MainArea">
    <!-- 表单内容 -->
    <form action="${base}/food" method="post" enctype="multipart/form-data">
        <input type="hidden" name="method" value="updateFood"/>
        <input type="hidden" name="foodId" value="${food.foodId}"/>

        <!-- 本段标题（分段标题） -->
        <div class="ItemBlock_Title">
            <img width="4" height="7" border="0" src="${detailUrl}/style/images/item_point.gif"> 菜品信息&nbsp;
        </div>
        <!-- 本段表单字段 -->
        <div class="ItemBlockBorder">
            <div class="ItemBlock">
                <div class="ItemBlock2">
                    <table cellpadding="0" cellspacing="0" class="mainForm">
                        <tr>
                            <td width="80px">菜系</td>
                            <td>
                                <select name="foodTypeId" style="width:80px">
                                    <c:forEach items="${foodType}" var="type" varStatus="vs">
                                        <option value="${type.typeId}"
                                                <c:if test="${type.typeId == food.foodTypeId}">selected</c:if>
                                        >${type.typeName}
                                        </option>
                                    </c:forEach>
                                </select>
                                <%--<input type="hidden" name="id" value="1"/>--%>

                            </td>
                        </tr>
                        <tr>
                            <td width="80px">菜名</td>
                            <td><input type="text" name="foodName" class="InputStyle" value="${food.foodName}"
                                       onchange="findFoods(this,this.value,${food.foodId})" id="foodName"/>
                                <span id="tableMsg">*</span>
                            </td>
                        </tr>
                        <tr>
                            <td>价格</td>
                            <td><input type="number" name="foodPrice" class="InputStyle" value="${food.foodPrice}"/> *
                            </td>
                        </tr>
                        <tr>
                            <td>会员价格</td>
                            <td><input type="number" name="foodVipPrice" class="InputStyle"
                                       value="${food.foodVipPrice}"/> *
                            </td>
                        </tr>

                        <tr>
                            <td>简介</td>
                            <td><textarea name="foodDesc" class="TextareaStyle">${food.foodDesc}</textarea></td>
                        </tr>
                        <tr>
                            <td width="80px">菜品图片</td>
                            <td>
                                <img style='max-width:68px;width:68px;width:expression(width > 68 ? "68px":width "px");max-width: 68px;'
                                     src="${food.foodImage}">
                                <input type="hidden" name="foodImage" value="${food.foodImage}">
                                <input type="file" name="imageUrl"/> *
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>


        <!-- 表单操作 -->
        <div id="InputDetailBar">
            <input type="submit" value="修改" class="FunctionButtonInput" id="regBtn">
            <a href="javascript:history.go(-1);" class="FunctionButton">返回</a>
        </div>
    </form>
</div>
</body>
<script>
    function findFoods(obj, foodName, foodId) {
        console.log(obj);
        var url = "${base}/food?method=findFood&foodName=" + foodName + "&foodId=" + foodId;
        $.get(url, null, function (result) {
            console.log(result)
            if (result == "success") {
                $("#tableMsg").html("餐桌名可用").css("color", "green");
                $("#regBtn").removeAttr("disabled");
            } else {
                $("#tableMsg").html("餐桌名已经存在").css("color", "red");
                $("#regBtn").attr("disabled", true);
            }

        })
    }
</script>
</html>
